<template>
  <form class="dynamic-form">
    <div class="form-section">
      <h3>基础信息</h3>
      <div class="form-row">
        <label>企业名称 <span class="required">*</span></label>
        <input
          v-model="formData.name"
          @blur="validateField('name')"
          :class="{ error: errors.name }"
        />
        <div v-if="errors.name" class="error-msg">{{ errors.name }}</div>
      </div>
      <!-- 其他基础字段... -->
    </div>

    <div class="form-section">
      <h3>行业专属信息</h3>
      <component
        v-for="field in dynamicFields"
        :key="field.model"
        :is="getFieldComponent(field.type)"
        v-model="formData[field.model]"
        v-bind="field"
        @update:modelValue="handleFieldUpdate(field.model)"
      />
    </div>
  </form>
</template>

<script setup>
import { computed, defineProps, defineEmits, reactive } from 'vue'

const props = defineProps({
  category: String,
  formData: Object
})

const emit = defineEmits(['update:formData', 'validate'])

const errors = reactive({})

const dynamicFields = computed(() => {
  switch (props.category) {
    case 'manufacture':
      return [
        {
          type: 'number',
          label: '年产能（件）',
          model: 'capacity',
          min: 0
        },
        {
          type: 'select',
          label: '生产类型',
          model: 'productionType',
          options: ['批量生产', '定制生产', '试验生产']
        }
      ]
    case 'logistics':
      return [
        {
          type: 'number',
          label: '运输车辆数',
          model: 'vehicles',
          min: 1
        },
        {
          type: 'checkbox',
          label: '运输类型',
          model: 'transportTypes',
          options: ['陆运', '空运', '海运']
        }
      ]
    default:
      return []
  }
})

const getFieldComponent = (type) => {
  const components = {
    text: 'input',
    number: 'input',
    select: 'select',
    checkbox: 'checkbox-group'
  }
  return components[type] || 'input'
}

const validateField = (field) => {
  // 实现具体验证逻辑
}

const handleFieldUpdate = (field) => {
  validateField(field)
  emit('validate', Object.keys(errors).length === 0)
}
</script>
